<template>
  <div class="userManagement">
    <MetaSearchForm @on-search="tableSearch">
      <el-form ref="userManagement_form" :model="searchData" label-width="85px">
        <el-form-item label="账号" class="userManagement_searchFromItem">
          <el-input v-model="searchData.username" placeholder="请输入账号"  clearable></el-input>
        </el-form-item>
        <el-form-item label="用户名称" class="userManagement_searchFromItem">
          <el-input v-model="searchData.name" placeholder="请输入用户名称" clearable></el-input>
        </el-form-item>
        <el-form-item label="手机号" class="userManagement_searchFromItem">
          <el-input v-model="searchData.phone" placeholder="请输入手机号" clearable></el-input>
        </el-form-item>
        <el-form-item label="设备" class="userManagement_searchFromItem">
          <el-select v-model="searchData.equipmentId" filterable clearable placeholder="请选择设备">
            <el-option
              v-for="item in equipmentList"
              :key="item.equipmentId"
              :label="item.equipmentName"
              :value="item.equipmentId">
              <span style="float: left">{{ item.equipmentName }}</span>
              <span style="float: right; color: #8492a6; font-size: 13px">{{ item.alias }}</span>
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="点位" class="userManagement_searchFromItem">
          <el-select placeholder="请选择点位名称" v-model="searchData.pointId" clearable>
            <el-option v-for="item in pointList"
              :key="item.id"
                    :label="item.pointName"
                    :value="item.id"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
    </MetaSearchForm>
    <MetaPageTable
      ref="userManagementTable"
      class="userManagement_table"
      table-title="用户管理"
      :need-checkbox="false"
      :is-auto-req="false"
      tableHeight="680"
      :tableData="userList"
      :display-item="displayItem"
      :btn-group="btnGroup"
      :line-btn-group="lineBtnGroup"
      @btnClick="tableBtnClick"
      @lineBtnClick="tableInlineBtnClick"
      @pageChange="initTableData($event,'page')"
      @limitChange="initTableData($event,'limit')"
      :isManualPaging="true"
    />
    <el-dialog
      v-if="tableChangeDialogFlag"
      :title="itemEditData.id && itemEditData.id !== '' ? '编辑用户' : '新建用户'"
      :visible.sync="tableChangeDialogFlag"
      width="60%"
      modal
      center
      :close-on-click-modal="false"
      :close-on-press-escape="false"
    >
      <div class="userEditDialog">
        <el-form ref="userEdit_form" :model="itemEditData" label-width="110px" :rules="editRules">
          <el-form-item label="账号" prop="username">
            <el-input v-if="itemEditData.id && itemEditData.id !== ''" v-model="itemEditData.username" placeholder="请输入账号" disabled></el-input>
            <el-input v-else v-model="itemEditData.username" placeholder="请输入账号"></el-input>
          </el-form-item>
          <el-form-item v-if="!itemEditData.id || itemEditData.id === ''" label="密码" prop="password">
            <el-input v-model="itemEditData.password" placeholder="请输入密码"></el-input>
          </el-form-item>
          <el-form-item label="用户名称" prop="name">
            <el-input v-model="itemEditData.name" placeholder="请输入用户名称"></el-input>
          </el-form-item>
          <el-form-item label="联系电话" prop="phone">
            <el-input v-model="itemEditData.phone" placeholder="请输入联系电话"></el-input>
          </el-form-item>
          <el-form-item label="邮箱" prop="email">
            <el-input v-model="itemEditData.email" placeholder="请输入邮箱"></el-input>
          </el-form-item>
          <el-form-item v-if="itemEditData.id && itemEditData.id !== ''" label="角色">
            <el-select
              v-model="itemEditData.rolesList"
              class="roleChooseSelect"
              multiple
              placeholder="请选择">
              <el-option
                v-for="item in rolesList"
                :key="item.id"
                :disabled="!item.enabled"
                :label="item.nameZh"
                :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item v-if="itemEditData.id && itemEditData.id !== ''" label="公司">
            <el-select
              v-model="itemEditData.companyid"
              class="roleChooseSelect"
              clearable
              placeholder="请选择">
              <el-option
                v-for="item in companyList"
                :key="item.id"
                :label="item.name"
                :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item v-if="itemEditData.id && itemEditData.id !== ''" label="反演参数">
            <el-select
              v-model="itemEditData.paramsList"
              class="roleChooseSelect"
              multiple
              placeholder="请选择">
              <el-option
                v-for="item in paramsList"
                :key="item.id"
                :label="item.paramname"
                :value="item.id">
                <span style="float: left">{{ item.paramname }}</span>
                <span style="float: right; color: #8492a6; font-size: 13px">{{ item.paramkey }}</span>
              </el-option>
            </el-select>
          </el-form-item>
          <el-row v-if="itemEditData.id && itemEditData.id !== ''" :gutter="20">
            <el-col :span="14">
              <el-form-item label="点位">
                <el-select
                  v-model="itemEditData.pointList"
                  class="roleChooseSelect"
                  multiple
                  collapse-tags
                  @change="onSelectChange"
                  placeholder="请选择">
                  <el-option
                    v-for="item in pointList"
                    :key="item.id"
                    :label="item.pointName"
                    :value="item.id">
                    <span style="float: left">{{ item.pointName }}</span>
                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.equipmentName }}</span>
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="2" style="height: 40px"></el-col>
            <el-col :span="8" style="line-height: 40px;color:red">(*点位为用户提供数据查看权限)</el-col>
          </el-row>
          <el-row v-if="itemEditData.id && itemEditData.id !== ''" :gutter="20">
            <el-col :span="14">
              <el-form-item label="设备">
                <el-select
                  v-model="itemEditData.equipmentList"
                  class="roleChooseSelect"
                  multiple
                  collapse-tags
                  @change="onSelectChange"
                  placeholder="请选择">
                  <el-option
                    v-for="item in equipmentList"
                    :key="item.equipmentId"
                    :label="item.equipmentName"
                    :value="item.equipmentId">
                      <span style="float: left">{{ item.equipmentName }}</span>
                      <span style="float: right; color: #8492a6; font-size: 13px">{{ item.alias }}</span>
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="2" style="height: 40px;display:flex;align-items: center;">
              <span class="equipmentChooseFromPoint" @click="doPushEquipment">同步</span>
            </el-col>
            <el-col :span="8" style="line-height: 40px;color:red">(*设备为用户提供设备操作权限)</el-col>
          </el-row>
          <div v-if="itemEditData.id && itemEditData.id !== ''" class="equipmentPoint_table">
            <div class="equipmentPoint_tableTitle" style="border-right: 1px solid #ddd">
              <div class="equipmentPoint_tableTitleItem">设备</div>
              <div class="equipmentPoint_tableTitleItem">点位</div>
            </div>
            <div class="equipmentPoint_tableTitle">
              <div class="equipmentPoint_tableTitleItem">设备</div>
              <div class="equipmentPoint_tableTitleItem">点位</div>
            </div>
            <div class="equipmentPoint_tableContent">
              <div class="equipmentPoint_tableContentItem" :style="equipmentPointContrast.length % 2 == 0 ? ((index == equipmentPointContrast.length - 1 || index == equipmentPointContrast.length - 2) ? 'border-bottom: none' : '') : (index == equipmentPointContrast.length - 1 ? 'border-bottom: none' : '')" v-for="(item,index) in equipmentPointContrast" :key="index">
                <div class="equipmentPoint_tableContentEP" :style="item.equipmentFlag == '1' ? 'color: #409EFF': 'text-decoration:line-through;color:#999'">{{item.equipmentName}}</div>
                <div class="equipmentPoint_tableContentEP" :style="item.pointFlag == '1' ? 'color: #409EFF': 'text-decoration:line-through;color:#999'">{{item.pointName}}</div>
              </div>
            </div>
          </div>
        </el-form>
        <div class="dialogFooter">
          <el-button size="mini" @click="editDialogClose()">取消</el-button>
          <el-button
            type="primary"
            size="mini"
            @click="editDialogSubmit()"
          >保存</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>


<script>
import MetaPageTable from '../components/MetaPageTable'
import MetaSearchForm from '../components/MetaSearchForm'
import deepClone from '../utils/deepClone'
import { checkPasswordStrong, isMobilePhone, isWscnEmail, validateLetterNumber } from '../utils/validate'
export default {
  name: 'userManagement',
  components: {
    MetaPageTable,
    MetaSearchForm
  },
  data () {
    let validateUsername = (rule, value, callback) => {
      if (value.trim() === '') {
        callback(new Error('请输入账号'));
      } else {
        if (value.length > 50) {
          callback(new Error('账号录入过长'));
        }
        if (!validateLetterNumber(value)) {
          callback(new Error('请输入英文或数字'));
        }
        callback();
      }
    }
    let validatePass = (rule, value, callback) => {
      let val = value.trim()
      if (val === '') {
        callback(new Error('请输入密码'));
      } else {
        if (!validateLetterNumber(val)) {
          callback(new Error('请输入英文或数字'));
        }
        if(val.length < 8) {
          callback(new Error('请输入不小于八位密码'));
        }
        if(checkPasswordStrong(val) <= 1) {
          callback(new Error('您输入的密码过于简单，请输入大小写、数字、符号任意两种组合'));
        }
        callback();
      }
    }
    let validateEmail = (rule, value, callback) => {
      if(value === '') {
        callback();
      }
      if (!isWscnEmail(value)) {
        callback(new Error('请输入正确邮箱'));
      }
      callback();
    }
    let validatePhone = (rule, value, callback) => {
      if(value.trim() == '') {
        callback(new Error('请输入联系电话'));
      }

      if (!isMobilePhone(value)) {
        callback(new Error('请输入正确联系电话'));

      }
      callback();
    }
    return {
      tableChangeDialogFlag: false,
      userList: {},
      displayItem: [
        {
          label: '账号',
          prop: 'username'
        },
        {
          label: '用户名称',
          prop: 'name'
        },
        {
          label: '联系电话',
          prop: 'phone',
        },
        {
          label: '邮箱',
          prop: 'email',
        },
        {
          label: '公司',
          prop: 'company',
        },
        {
          label: '角色',
          prop: 'role',
        },
        {
          label: '反演参数',
          prop: 'param',
          width: 250
        },
        {
          label: '状态',
          prop: 'enabled',
          type: "if",
          format: {
            'false': "停用",
            'true': "启用"
          }
        },
        {
          label: '设备',
          prop: 'equipment',
        },
        // {
        //   label: '创建时间',
        //   prop: 'create_date'
        // }
      ],
      lineBtnGroup: [
        // {
        //   id: 'resetPwd',
        //   title: '重置密码',
        // },
        {
          id: 'changePwd',
          title: '修改密码',
        },
        {
          id: 'edit',
          title: '编辑',
        },
        {
          id: 'open',
          title: '启用',
          hideCheck: this.btnHidecheck
        },
        {
          id: 'stop',
          title: '停用',
          hideCheck: this.btnHidecheck
        }
      ],
      btnGroup: [{
        id: 'new',
        title: '新建'
      }],
      itemEditData: {
        id: '',
        username: '',
        password: '',
        name: '',
        phone: '',
        email: '',
        rolesList: [],
        companyid: '',
        equipmentList: [],
        pointList: [],
        paramsList: []
      },
      editRules: {
        username: [
          { required: true, validator: validateUsername, trigger: 'blur' }
        ],
        password: [
          { required: true, validator: validatePass, trigger: 'blur' }
        ],
        name: [
          { required: true, message: '请输入用户名称', trigger: 'blur' },
        ],
        email: [
          { validator: validateEmail, trigger: 'blur' }
        ],
        phone: [
          { required: true, message: '请输入联系电话', trigger: 'blur' },
          { validator: validatePhone, trigger: 'blur' }
        ]
      },
      rolesList: [],
      companyList: [],
      equipmentList: [],
      pointList: [],
      paramsList: [],
      searchData : {
        username: '',
        name:'',
        phone:'',
        equipmentId:'',
        pointId:''
      },
      searchDataForTable: {},
      equipmentPointContrast: [],
      tablePage: 1,
      tableLimit: 10
    }
  },
  mounted() {
    this.initRoleList()
    this.initEquipmentList()
    this.initPointList()
    this.initParamsList()
    this.initCompanyList(() => {
      this.initTableData()
    })
  },
  methods: {
    initRoleList() {
      this.$fetch({
        url: process.env.PROGOO_GATE_WATER + 'admin/role',
        method: "get",
        params: {}
      }).then(res => {
        if (res.data.code === 200) {
          this.rolesList = res.data.result
        }else {
          this.$notify.error({
            title: '错误',
            message: res.data.message
          });
        }
      })
    },
    initCompanyList(callback) {
      this.$fetch({
        url: process.env.PROGOO_GATE_WATER + 'admin/company',
        method: "post",
        data: {
          page: 1,
          limit: 99999999
        }
      }).then(res => {
        if (res.data.code === 200) {
          this.companyList = res.data.result.content
          if(callback && typeof(callback) === 'function') {
            callback()
          }
        }else {
          this.$notify.error({
            title: '错误',
            message: res.data.message
          });
        }
      })
    },
    initParamsList() {
      this.$fetch({
        url: process.env.PROGOO_GATE_WATER + 'admin/paramThreshold',
        method: "post",
        data: {
          page: 1,
          limit: 99999999
        }
      }).then(res => {
        if (res.data.code === 200) {
          this.paramsList = res.data.result.content
        }else {
          this.$notify.error({
            title: '错误',
            message: res.data.message
          });
        }
      })
    },
    initEquipmentList() {
      this.$fetch({
        url: process.env.PROGOO_GATE_WATER + 'admin/equipmentListMap',
        method: "post",
        data: {
          page: 1,
          limit: 999999999
        }
      }).then(res => {
        if (res.data.code === 200) {
          this.equipmentList = res.data.result.content
        }else {
          this.$notify.error({
            title: '错误',
            message: res.data.message
          });
        }
      })
    },
    initPointList() {
      let params = {}
      params.page = 1
      params.limit = 9999999
      this.$fetch({
        url: process.env.PROGOO_GATE_WATER + 'pointEquipment/getPointEquipmentPage',
        method: "post",
        data: params
      }).then(res => {
        if (res.data.code === 200) {
          this.pointList = res.data.result.content
        }else {
          this.$notify.error({
            title: '错误',
            message: res.data.message
          });
        }
      })
    },
    initTableData(eventData,key) {

      let param = this.searchDataForTable
      if(eventData) {
        if(key == 'page') {
          this.tablePage = eventData
        }else if(key == 'limit') {
          this.tableLimit = eventData
        }
      }else {
        this.tablePage = 1
        this.tableLimit = 10
      }
      param.page = this.tablePage
      param.limit = this.tableLimit
      this.$fetch({
        url: process.env.PROGOO_GATE_WATER + 'admin/user',
        method: "post",
        data: param
      }).then(res => {
        if (res.data.code === 200) {
          this.userList = res.data.result
          for(let i in res.data.result.content) {
            let role = ''
            let rolesList = []
            for(let j in res.data.result.content[i].roles) {
              if(role === '') {
                role = res.data.result.content[i].roles[j].nameZh
              }else {
                role += "，" + res.data.result.content[i].roles[j].nameZh
              }
              if(this.checkRole(res.data.result.content[i].roles[j].id)) {
                rolesList.push(res.data.result.content[i].roles[j].id)
              }
            }
            this.userList.content[i].role = role
            this.userList.content[i].rolesList = rolesList

            let param = ''
            let paramsList = []
            if(res.data.result.content[i].paramthresholds) {
              for(let j in res.data.result.content[i].paramthresholds) {
                if(param === '') {
                  param = res.data.result.content[i].paramthresholds[j].paramname
                }else {
                  param += "，" + res.data.result.content[i].paramthresholds[j].paramname
                }
                paramsList.push(res.data.result.content[i].paramthresholds[j].id)
              }
              this.userList.content[i].param = param
              this.userList.content[i].paramsList = paramsList
            }

            let equipment = ''
            let equipmentList = []
            for(let j in res.data.result.content[i].equipments) {
              if(equipment === '') {
                equipment = res.data.result.content[i].equipments[j].equipmentname
              }else {
                equipment += "，" + res.data.result.content[i].equipments[j].equipmentname
              }
              equipmentList.push(res.data.result.content[i].equipments[j].id)
            }
            this.userList.content[i].equipment = equipment
            this.userList.content[i].equipmentList = equipmentList

            let point = ''
            let pointList = []
            for(let j in res.data.result.content[i].points) {
              if(point === '') {
                point = res.data.result.content[i].points[j].pointName
              }else {
                point += "，" + res.data.result.content[i].points[j].pointName
              }
              pointList.push(res.data.result.content[i].points[j].id)
            }
            this.userList.content[i].point = point
            this.userList.content[i].pointList = pointList

            this.userList.content[i].company = this.getCompanyName(this.userList.content[i].companyid)
          }
          this.$nextTick(() => {
            if(key && key !== '') {
              let otherDatas = {}
              otherDatas.content = this.userList.content
              otherDatas.totalElements = this.userList.totalElements
              otherDatas.page = this.tablePage
              otherDatas.limit = this.tableLimit
              this.$refs.userManagementTable.formDataInit(false, otherDatas)
            }else {
              this.$refs.userManagementTable.formDataInit()
            }
          })
        }else {
          this.$notify.error({
            title: '错误',
            message: res.data.message
          });
        }
      })

    },
    getCompanyName(cId) {
      if(!cId || cId === '') {
        return ''
      }
      let cName = ''
      for(let i in this.companyList) {
        if(this.companyList[i].id === cId) {
          cName = this.companyList[i].name
          return cName
        }
      }
      return cName
    },
    tableInlineBtnClick(item) {
      if (item.button === 'edit') {
        this.itemEditData = deepClone(item.rows)
        this.onSelectChange()
        this.tableChangeDialogFlag = true
      }else if(item.button === 'resetPwd') {
        this.$confirm('是否确认将此用户密码重置?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$fetch({
            url: process.env.PROGOO_GATE_WATER + "admin/user/password",
            method: "put",
            data: {
              username: item.rows.username
            }
          }).then(res => {
            if (res.data.code === 200) {
              this.$notify({
                title: '成功',
                message: '操作成功',
                type: 'success'
              });
            }else {
              this.$notify.error({
                title: '错误',
                message: res.data.message
              });
            }
          })
        })
      }else if (item.button === 'open') {
        this.$confirm('是否确认启用此用户?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          let params = {
            id: item.rows.id,
            enabled: true,
            username: item.rows.username
          }
          this.$fetch({
            url: process.env.PROGOO_GATE_WATER + "admin/user/status",
            method: "put",
            data: params
          }).then(res => {
            if (res.data.code === 200) {
              this.$message({
                type: 'success',
                message: '操作成功!'
              });
              this.initTableData(this.tablePage, 'page')
            }else {
              this.$notify.error({
                title: '错误',
                message: res.data.message
              });
            }
          })
        })
      }else if (item.button === 'stop') {
        this.$confirm('是否确认停用此用户?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          let params = {
            id: item.rows.id,
            enabled: false,
            username: item.rows.username
          }
          this.$fetch({
            url: process.env.PROGOO_GATE_WATER + "admin/user/status",
            method: "put",
            data: params
          }).then(res => {
            if (res.data.code === 200) {
              this.$message({
                type: 'success',
                message: '操作成功!'
              });
              this.initTableData(this.tablePage, 'page')
            }else {
              this.$notify.error({
                title: '错误',
                message: res.data.message
              });
            }
          })
        })
      }else if(item.button === 'changePwd') {
        this.$prompt('请输入密码', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          closeOnClickModal: false,
          inputValidator: val => {
            if(val && val !== '') {
              if(val.length < 8) {
                return false
              }
              if(checkPasswordStrong(val) <= 1) {
                return false
              }
              return true
            }else {
              return false
            }
          },
          inputErrorMessage: '请输入正确密码（规则不少于八位且大小写、数字、符号任意两种组合）'
        }).then(({ value }) => {
          this.$confirm('是否确认修改密码?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            this.$fetch({
              url: process.env.PROGOO_GATE_WATER + "admin/user/passwordEdit",
              method: "put",
              data: {
                username: item.rows.username,
                password: value
              }
            }).then(res => {
              if (res.data.code === 200) {
                this.$message({
                  type: 'success',
                  message: '操作成功!'
                });
              }else {
                this.$notify.error({
                  title: '错误',
                  message: res.data.message
                });
              }
            })
          })
        })
      }
    },
    tableBtnClick(item) {
      if (item.button === 'new') {
        this.itemEditData = {
          id: '',
          username: '',
          password: '',
          name: '',
          phone: '',
          email: '',
          rolesList: [],
          equipmentList: [],
          pointList: [],
          companyid: '',
          paramsList: []
        }
        this.tableChangeDialogFlag = true
      }
    },
    editDialogSubmit() {
      this.$refs['userEdit_form'].validate((valid) => {
        if (valid) {
          let params = {}
          let url = ''
          let method = ''
          if(this.itemEditData.id === '') {
            params.username = this.itemEditData.username
            params.password = this.itemEditData.password
            params.name = this.itemEditData.name
            params.phone = this.itemEditData.phone
            params.email = this.itemEditData.email
            url = process.env.PROGOO_GATE_WATER + "admin/register"
            method = 'post'
          }else {
            params.id = this.itemEditData.id
            params.username = this.itemEditData.username
            params.name = this.itemEditData.name
            params.phone = this.itemEditData.phone
            params.email = this.itemEditData.email
            params.companyid = this.itemEditData.companyid
            params.roles = []
            for(let i in this.itemEditData.rolesList) {
              let rolesItem = {}
              rolesItem.id = this.itemEditData.rolesList[i]
              params.roles.push(rolesItem)
            }
            params.equipments = []
            for(let i in this.itemEditData.equipmentList) {
              let equipmentsItem = {}
              equipmentsItem.id = this.itemEditData.equipmentList[i]
              params.equipments.push(equipmentsItem)
            }
            params.points = []
            for(let i in this.itemEditData.pointList) {
              let pointsItem = {}
              pointsItem.id = this.itemEditData.pointList[i]
              params.points.push(pointsItem)
            }
            params.paramthresholds = []
            for(let i in this.itemEditData.paramsList) {
              let paramsItem = {}
              paramsItem.id = this.itemEditData.paramsList[i]
              params.paramthresholds.push(paramsItem)
            }
            url = process.env.PROGOO_GATE_WATER + "admin/edit"
            method = 'put'
          }
          this.$fetch({
            url: url,
            method: method,
            data: params
          }).then(res => {
            if (res.data.code === 200) {
              this.editDialogClose()
              this.initTableData(this.tablePage, 'page')
              this.$notify({
                title: '成功',
                message: '操作成功',
                type: 'success'
              });
            }else {
              this.$notify.error({
                title: '错误',
                message: res.data.message
              });
            }
          })
        } else {
          return false;
        }
      });
    },
    editDialogClose() {
      this.itemEditData = {
        id: '',
        username: '',
        password: '',
        name: '',
        phone: '',
        email: '',
        rolesList: [],
        equipmentList: [],
        pointList: [],
        companyid: '',
        paramsList: [],
      }
      this.tableChangeDialogFlag = false
    },
    btnHidecheck(rowData, item) {
      if(!rowData.enabled && item.id === 'open') {
        return true
      }else if(rowData.enabled && item.id === 'stop'){
        return true
      }
      return false
    },
    tableSearch() {
      let param = {}
      for(let key in this.searchData ) {
        if(key === 'dateBetween') {

          param.startTime = this.searchData[key] && this.searchData[key].length > 0 ? this.searchData[key][0] + ' 00:00:00' : ''
          param.endTime =  this.searchData[key] && this.searchData[key].length > 0 ? this.searchData[key][1] + ' 23:59:59' : ''
        }else {

          param[key] = this.searchData[key]
        }
      }
      this.searchDataForTable = param

      this.initTableData(1, 'page')
    },
    doPushEquipment() {
      for(let i in this.itemEditData.pointList) {
        for(let j in this.pointList) {
          if(this.itemEditData.pointList[i] == this.pointList[j].id) {
            if(this.pointList[j].equipmentId && this.pointList[j].equipmentId !== '') {
              let has = false
              for(let k in this.itemEditData.equipmentList) {
                if(this.pointList[j].equipmentId === this.itemEditData.equipmentList[k]) {
                  has = true
                  break
                }
              }
              if(!has) {
                this.itemEditData.equipmentList.push(this.pointList[j].equipmentId)
              }
            }
            break
          }
        }
      }
      this.onSelectChange()
    },
    onSelectChange() {
      this.equipmentPointContrast = []
      for(let i in this.itemEditData.equipmentList) {
        let has = false
        for(let j in this.pointList) {
          if(this.itemEditData.equipmentList[i] === this.pointList[j].equipmentId) {
            let item = {}
            item.pointName = this.pointList[j].pointName
            item.pointId = this.pointList[j].id
            item.pointFlag = '0'
            item.equipmentId = this.itemEditData.equipmentList[i]
            item.equipmentName = this.pointList[j].equipmentName
            item.equipmentFlag = '1'
            this.equipmentPointContrast.push(item)
            has = true
            break
          }
        }
        if(!has) {
          for(let j in this.equipmentList) {
            if(this.itemEditData.equipmentList[i] === this.equipmentList[j].equipmentId) {
              let item = {}
              item.pointName = ''
              item.pointId = ''
              item.pointFlag = '0'
              item.equipmentId = this.itemEditData.equipmentList[i]
              item.equipmentName = this.equipmentList[j].equipmentName
              item.equipmentFlag = '1'
              this.equipmentPointContrast.push(item)
              break
            }
          }
        }
      }
      for(let i in this.itemEditData.pointList) {
        let has = false
        for(let j in this.equipmentPointContrast) {
          if(this.itemEditData.pointList[i] === this.equipmentPointContrast[j].pointId) {
            this.equipmentPointContrast[j].pointFlag = '1'
            has = true
            break
          }
        }
        if(!has) {
          for(let j in this.pointList) {
            if(this.itemEditData.pointList[i] === this.pointList[j].id) {
              let item = {}
              item.pointName = this.pointList[j].pointName
              item.pointId = this.itemEditData.pointList[i]
              item.pointFlag = '1'
              item.equipmentId = this.pointList[j].equipmentId ? this.pointList[j].equipmentId : ''
              item.equipmentName = this.pointList[j].equipmentName ? this.pointList[j].equipmentName : ''
              item.equipmentFlag = '0'
              this.equipmentPointContrast.push(item)
              break
            }
          }
        }
      }
    },
    checkRole(id) {
      for(let i in this.rolesList) {
        if(this.rolesList[i].id === id) {
          if(!this.rolesList[i].enabled) {
            return false
          }else {
            return true
          }
        }
      }
      return false
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="less">
.userManagement{
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding: 15px;
  overflow-y: scroll;
  .userManagement_table {
    width: 100%;
    overflow-y: unset;
  }
  .userManagement_searchFromItem{
    float: left;
  }
  .userEditDialog {
    width: 100%;
    max-height: 550px;
    overflow-y: scroll;
    overflow-x: hidden;
    .equipmentPoint_table {
      width: 100%;
      float: left;
      margin-bottom: 20px;
      border: 1px solid #ddd;
      .equipmentPoint_tableTitle {
        width: 50%;
        height: 40px;
        float: left;
        border-bottom: 1px solid #ddd;
        box-sizing: border-box;
        .equipmentPoint_tableTitleItem {
          width: 50%;
          height: 100%;
          float: left;
          text-align: center;
          line-height: 40px;
          font-weight: bold;
        }
      }
      .equipmentPoint_tableContent {
        width: 100%;
        float: left;
        .equipmentPoint_tableContentItem {
          width: 50%;
          height: 40px;
          float: left;
          border-bottom: 1px solid #ddd;
          box-sizing: border-box;
          .equipmentPoint_tableContentEP {
            width: 50%;
            float: left;
            height: 40px;
            text-align: center;
            line-height: 40px;
          }
        }
        .equipmentPoint_tableContentItem:nth-child(odd) {
          border-right: 1px solid #ddd;
        }
      }
    }
  }
  .dialogFooter {
    display: flex;
    justify-content: center;
    margin-top: 0.5rem;
    width: 100%;
  }
  .roleChooseSelect {
    width: 100%;
  }
  .equipmentChooseFromPoint {
    cursor: pointer;
    color: #409EFF;
    text-decoration: underline;
  }
}
</style>
